<template>
  <el-form :model="formData" label-width="auto" ref="formRef" size="large">
    <el-form-item label="预案" prop="name">
      <el-select v-model="formData.name" placeholder="请选择"> </el-select>
    </el-form-item>

    <el-form-item label="响应等级" prop="zrdw">
      <el-select v-model="formData.zrdw" placeholder="请选择"> </el-select>
    </el-form-item>

    <el-form-item label="制定单位" prop="type">
      <span>xxx制定单位</span>
    </el-form-item>

    <el-form-item label="预案内容" prop="xmlr">
      <div>xxxx内容xxxx内容，xxxx内容xxxx内 容xxxx内容xxxx内容</div>
    </el-form-item>
    <el-form-item>
      <el-col :span="24" style="text-align: right">
        <el-button size="large" class="cancel" @click="resetForm"
          >取消</el-button
        >

        <el-button size="large" class="save" type="primary" @click="confirm"
          >启动预案</el-button
        >
      </el-col>
    </el-form-item>
  </el-form>
</template>

<script setup lang="ts">
import Mitt from "@/utils/mitt";
import type { ComponentSize, FormInstance, FormRules } from "element-plus";
const formData = reactive({
  name: "",
  type: "",
  zrdw: "",
  jsdw: "",
  xmlr: "",
  wcsj: "",
  jd: "",
  wd: "",
});

const formRef = ref<FormInstance>();

function resetForm() {
  formRef.value.resetFields();
}

function confirm() {
  Mitt.emit("close-dialog");
}
</script>

<style lang="less" scoped>
/deep/ .el-upload-dragger {
  padding: inherit;
  border: 1px dashed #4fb9cf;
  background-color: inherit;
  padding: 21px 0;
}

.cancel {
  color: #1bfbfa;
  background: rgba(27, 251, 250, 0.19);
  border: 1px solid #1bfbfa;
}
.save {
  color: #091c25;
  background: #1bfbfa;
}
</style>
